<?= flash() ?? ''; ?>

<div class="breadcrumb d-flex align-items-center px-3 js-scroll js-top">
    <div class="btn btn-icon me-4 js-back" aria-label="返回" role="button" tabindex="0">
        <i class="iconfont icon-left-arrow fs-20"></i>
    </div>
    <h2 class="w-100 fs-18 hand js-top"><span class="text-truncate"><?= $page_title ?? '' ?></span></h2>
</div>

<div class="article">
    <div class="d-flex align-items-center mt-2 px-3">
        <a href="/user/profile/<?= $post->user_id ?>" data-letters="<?= mb_substr($post->username, 0, 1, 'UTF-8'); ?>"></a>
        <p><?= $post->username ?></p>
        <div class="ms-auto">
            <div class="dropdown">
                <button class="btn btn-icon" type="button" data-bs-toggle="dropdown" aria-expanded="false"><i class="iconfont icon-more fs-24"></i></button>
                <div class="dropdown-menu dropdown-menu-end shadow-sm">
                    <a class="dropdown-item" href="#">
                        <i class="iconfont icon-shield me-2"></i>
                        <span class="fw-bold">屏蔽</span>
                    </a>
                    <a class="dropdown-item" href="#">
                        <i class="iconfont icon-report me-2"></i>
                        <span class="fw-bold">举报 帖子</span>
                    </a>
                </div>
            </div>
        </div>
    </div>
    <div class="p-3">
        <div class="typo-text fs-18" id="postContent"><?= $post->content ?></div>
        <?php if($post->images > 0): ?>
            <p><img class="img-fluid mt-3" src="/upload/<?= $post->filename ?>" alt="" data-zoomable loading="lazy" decoding="async"></p>
        <?php endif ?>
        <div class="avatar avatar-pendant">
            <img src="/img/avatar_default.jpeg" data="face" alt="">
            <img src="/img/face/garb/fighters.png" data="pendant" alt="">
        </div>
        <div class="d-flex align-items-center py-3 fs-14 text-muted border-bottom">
            <span class="d-inline-block me-3">
                <time datetime="<?= date("Y-m-d H:i:s", $post->created_at) ?>"><?= nice_time($post->created_at) ?></time>
            </span>
            阅读用时: <span class="d-inline-block me-3" id="readingTime"></span>
            来自: <span>ip</span>
            <?php if($post->comments > 0): ?>
            <!-- <div class="chat-area-group ms-auto">
                <img class="chat-area-profile" src="/img/avatar.png" alt="">
                <img class="chat-area-profile" src="/img/avatar2.jpg" alt="">
                <img class="chat-area-profile" src="/img/avatar_default.jpeg" alt="">
                <span><?= $post->comments ?></span>
            </div> -->
            <?php endif ?>
        </div>
    </div>

    <div class="px-3 mb-3 d-flex justify-content-around post-actions">
        <!-- 回复 -->
        <a role="button" class="post-action-reply cursor-arrow" title="回复">
            <div class="d-flex justify-content-center post-action-icon">
                <i class="iconfont icon-comment"></i>
            </div>
            <span><?= $post->comments !== 0 ? $post->comments : '' ?></span>
        </a>

        <?php include APP_PATH . 'like/views/_like.php'; ?>
        <?php include APP_PATH . 'fav/views/_fav.php'; ?>

        <!-- 分享 -->
        <a href="javascript:;" class="post-action-fav" data-bs-toggle="tooltip" data-bs-trigger="hover" title="分享">
            <div class="d-flex justify-content-center post-action-icon">
                <i class="iconfont icon-upload"></i>
            </div>
        </a>
    </div>

    <?= mini\Template::partial('partials/_comment', $data) ?>

    <?php include APP_PATH . 'comment/views/_comments.php'; ?>

<script>
document.addEventListener('DOMContentLoaded', function() {
    mediumZoom('[data-zoomable]', {
        margin: 30,
        background: 'rgba(0,0,0,.7)',
    });
});
</script>